<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 表单域，submit的是form里面的内容，action表示提交给谁，method表示如何提交 -->
     <!-- name表示参数名，value表示参数取值 -->
    <form action="./test1.html" method="get">
        <!-- 显示一个文本框 -->
        用户名：<input type="text" size="30" name="username"><br>
        密码：<input type="password" name="password"><br>
        <!-- 单选按钮 -->
        <!-- 多个单独的按钮通过相同的name关联起来 -->
        <!-- id标签类似于数据库中的唯一键，在表单中是唯一的 -->
        <!-- 将“男”这个字与该按钮关联起来（点击汉字也可以实现点击按钮的效果） -->
        性别：<input type="radio" name="gender" id="male" value="1"> <label for="male">男</label>
            <input type="radio" name="gender" id="female" value="2"> <label for="female">女</label>
            <input type="radio" name="gender" id="unknow" value="3"> <label for="unknow">未知</label><br>
            <!-- 复选框 -->
        兴趣：<input type="checkbox" name="hobby" id="" value="1">篮球
            <input type="checkbox" name="hobby" id="" value="2">足球
            <input type="checkbox" name="hobby" id="" value="3">排球
            <input type="checkbox" name="hobby" id="" value="4">乒乓球<br>
        <!-- 第一种按钮（普通按钮） -->
        <input type="button" value="按钮1">
        <!-- 第二种按钮 -->
        <button>按钮2</button>
        <!-- 第三种按钮，会提交页面（需要搭配form标签） -->
        <input type="submit" value="提交">
        <br>
        <!-- 方便起见，这里开始都不写name和value传参了 -->
        专业：<select>
            <option name="a" value="1" selected>计算机</option>
            <option name="b" value="2">物联网</option>
            <option name="c" value="3">人工智能</option>
        </select><br>
        <!-- 文本域，这里的空格是有效的 -->
        个人描述：<textarea rows="5" cols="10"></textarea>
    </form>
    
</body>
</html>